﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="EWDTAssignment.Register" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script type="text/jscript">
    function inputBlur(textBox,content) {
            if (textBox.value.length <= 0) {
                textBox.value = content;
                textBox.style.color = "Gray";
            }
        }
        function inputFocus(textBox, content) {
            if (textBox.value == content) {
                textBox.value = "";
                textBox.style.color = "Black";
            }
        }
    </script>
    <style type="text/css">
        .style1
        {
            height: 18px;
        }
        .style2
        {
            height: 26px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server" >
    <table style="width:100%;" onpaste="return false">
        <tr>
            <td align="center" class="style1" colspan="3">
                Register Form</td>
        </tr>
        <tr>
            <td class="style1" width="150">
                Username:</td>
            <td class="style1" width="280">
                <asp:TextBox ID="UsernameTbx" onblur="inputBlur(this,'Enter User Name')" 
                    onfocus="inputFocus(this,'Enter User Name')" runat="server" Width="274px" 
                    value="Enter User Name" style="color:Gray"></asp:TextBox>
                <br />
            </td>
            <td class="style1" width="155">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" 
                    ControlToValidate="UsernameTbx" ErrorMessage="*Username is required" 
                    InitialValue="Enter User Name" Display="Dynamic"></asp:RequiredFieldValidator>
                <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" 
                    Display="Dynamic" ErrorMessage="*Username should between 6-12digits" 
                    ValidationExpression="\w{6,12}" ControlToValidate="UsernameTbx"></asp:RegularExpressionValidator>
            </td>
        </tr>
        <tr>
            <td class="style1" width="150">
                &nbsp;</td>
            <td class="style1" width="280">
                <asp:Button ID="AvailabilityBtn" runat="server" Text="Check Availability" 
                    onclick="Button1_Click" ValidationGroup="1" />
            </td>
            <td class="style1" width="155">
                <asp:Label ID="AvailabilityLabel" runat="server"></asp:Label>
            </td>
        </tr>
        <tr>
            <td>
                Password:</td>
            <td width="280">
                <asp:TextBox ID="PasswordTbx" runat="server" Width="274px" TextMode="Password" 
                    ToolTip="Enter Password"></asp:TextBox>
                <asp:PasswordStrength ID="PasswordTbx_PasswordStrength" runat="server" 
                    TargetControlID="PasswordTbx">
                </asp:PasswordStrength>
                <br />
            </td>
            <td>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" 
                    ErrorMessage="*Password is required" ControlToValidate="PasswordTbx" 
                    Display="Dynamic"></asp:RequiredFieldValidator>
                <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                    ControlToValidate="PasswordTbx" 
                    ErrorMessage="*Password should between 6-8 digits" 
                    ValidationExpression="\w{6,8}" Display="Dynamic"></asp:RegularExpressionValidator>
            </td>
        </tr>
        <tr>
            <td>
                Re-enter Password:</td>
            <td width="280">
                <asp:TextBox ID="RePasswordTbx" runat="server" Width="274px" 
                    TextMode="Password" ToolTip="Re-enter Password"></asp:TextBox>
                <asp:PasswordStrength ID="RePasswordTbx_PasswordStrength" runat="server" 
                    TargetControlID="RePasswordTbx">
                </asp:PasswordStrength>
                <br />
            </td>
            <td>
                <asp:CompareValidator ID="CompareValidator1" runat="server" 
                    ErrorMessage="*The passwords must match" ControlToCompare="RePasswordTbx" 
                    ControlToValidate="PasswordTbx" Display="Dynamic"></asp:CompareValidator>
            </td>
        </tr>
        <tr>
            <td>
                Email</td>
            <td width="280">
                <asp:TextBox ID="EmailTbx" onblur="inputBlur(this,'Enter Your Email Address')" 
                    onfocus="inputFocus(this,'Enter Your Email Address')" runat="server" 
                    Width="274px" value="Enter Your Email Address" style="color:Gray"></asp:TextBox>
                <br />
            </td>
            <td>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" 
                    ControlToValidate="EmailTbx" ErrorMessage="*Email is required" 
                    InitialValue="Enter Your Email Address" Display="Dynamic"></asp:RequiredFieldValidator>
                <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" 
                    ControlToValidate="EmailTbx" ErrorMessage="*Wrong Email Format" 
                    ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
            </td>
        </tr>
        <tr>
            <td>
                Re-enter Email</td>
            <td width="280">
                <asp:TextBox ID="ReEmailTbx" 
                    onblur="inputBlur(this,'Re-Enter Your Email Address')" 
                    onfocus="inputFocus(this,'Re-Enter Your Email Address')" runat="server" 
                    Width="274px" value="Re-Enter Your Email Address" style="color:Gray"></asp:TextBox>
                <br />
            </td>
            <td>
                <asp:CompareValidator ID="CompareValidator2" runat="server" 
                    ErrorMessage="*Emails must match" ControlToCompare="ReEmailTbx" 
                    ControlToValidate="EmailTbx" Display="Dynamic"></asp:CompareValidator>
            </td>
        </tr>
        <tr>
            <td>
                Security Question:</td>
            <td width="280">
                <asp:DropDownList ID="SecurityQuestionDL" runat="server" Width="274px">
                    <asp:ListItem>-Select One-</asp:ListItem>
                    <asp:ListItem>What town was your father born in?</asp:ListItem>
                    <asp:ListItem>What is the last name of your closest childhood friend?</asp:ListItem>
                    <asp:ListItem>What was the name of your primary school?</asp:ListItem>
                    <asp:ListItem>What is the name of the street on which you grew up?</asp:ListItem>
                    <asp:ListItem>What was the name of your first pet?</asp:ListItem>
                    <asp:ListItem>What town was your mother born in?</asp:ListItem>
                    <asp:ListItem>What was the last name of favorite primary school teacher?</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" 
                    Display="Dynamic" ErrorMessage="*Select your security question" 
                    InitialValue="-Select One-" ControlToValidate="SecurityQuestionDL"></asp:RequiredFieldValidator>
            </td>
        </tr>
        <tr>
            <td class="style2">
                Security Answer:</td>
            <td width="280" class="style2">
                <asp:TextBox ID="AnswerTbx" onblur="inputBlur(this,'Enter Security Answer')" 
                    onfocus="inputFocus(this,'Enter Security Answer')" runat="server" Width="275px" 
                    value="Enter Security Answer" style="color:Gray"></asp:TextBox>
                <br />
            </td>
            <td class="style2">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" 
                    ControlToValidate="AnswerTbx" ErrorMessage="*Security answer is required" 
                    Display="Dynamic" InitialValue="Enter Security Answer"></asp:RequiredFieldValidator>
            </td>
        </tr>
        <tr>
            <td>
                verify code:</td>
            <td width="280">
                
                <div>
                <asp:TextBox ID="verificationTbx" onblur="inputBlur(this,'Enter Verify Code')" 
                    onfocus="inputFocus(this,'Enter Verify Code')" runat="server" value="Enter Verify Code" style="color:Gray"></asp:TextBox>
                <img src="verification.ashx" onclick="this.src='verification.ashx?aaa='+new Date()+''" />   
                </div>
                
            </td>
            <td>
            
                <asp:Label ID="verificationLabel" runat="server"></asp:Label>
            
                </td>
        </tr>
    </table>
    <br />
    <asp:Button ID="SubmitBtn" runat="server" Text="Submit" Width="167px" 
        onclick="SubmitBtn_Click" />
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
</asp:Content>
